<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        /**
         * 
         * 区别: 表单数据的管理权由谁掌握
         * 
         * 受控: 数据由react组件的state控制 
         * 场景: 实时验证表单，多地区字段联动，复杂表单
         * 
         * 
         * 非受控: 数据由DOM元素自身管理，不通过state控制，通过ref来访问DOM节点获取当前值
         * 
         * 文件上传，简单的搜索框或者一次性提交的表单，性能更好，简单表单
         * 
         * **/ 
    </script>
</body>
</html>